<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <script src="./vue.js"></script>
</head>

<body>
    <div id="app">
        <h1 style="color: brown">{{ message }}</h1>
        <h1>{{ 10+29 }}</h1>
        <h1 v-text="message"></h1>
        <input type="text" v-model="message" />
        <p v-for="item of people">{{item.name+ "是" + item.age + "岁"}} </p>

        <button @click="show(222)">提交</button>

        <a href="www.baidu.com">
            <img src="./下载%20(3).png" width=70% />
        </a>

        <p v-if="type == 'A' ">A</p>
        <p v-else>B</p>
        <p v-show="flag">欧罗拉欧拉欧拉</p>

    </div>
</body>
<script type="text/javascript">
    let vm = new Vue({
        el: '#app',
        data: {
            type: "A",
            flag: true,
            srciurl: "./下载%20(3).png",
            hrefurl: "www.baidu.com",
            message: 'Hello Vue!!!!',
            people: [{
                name: "小明",
                age: 22
            }, {
                name: "小棚",
                age: 20
            }, {
                name: "小甘",
                age: 26
            }, {
                name: "小土",
                age: 19
            }],
        },
        methods: {
            show(parament) {
                alert(parament);
            }
        }
    });
</script>

</html>